<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>文档标题</title>
  <style>
    .parent-wraper{
      position:relative;
      height:50px;
      border:1px solid blue;
    }
    .child-wraper{
      border:1px solid red;
      position:absolute;
      top:0;
      left:0;
      bottom:0;
      right:0;
      height:50%;
      margin:auto;
    }
  </style>
</head>
<body>
<div class="parent-wraper">
  <div class="child-wraper"></div>
</div>


</body>
</html>
